目前H5基本上是在微信上传播和展示，系统类型和微信环境在很大程度上影响最终展示效果和体验，iOS和Android的用户比例大概是3:7，不能放弃Android用户，但是体验摆在面前。微信每一次更新，也会造成某些效果的天差地别。
下面分享H5视频和音频在Android和iPhone的差异性，提前了解清楚，在制作过程中尽量避免这些问题。
视频篇
用户体验对比
Android手机上浏览视频存在的四大问题：
1、视频无法自动播放，只能是点击事件控制视频播放或者在视频页面手动点击控制；
2、无法隐藏视频播放的进度条，很多H5直接可以看出是视频效果；
3、视频播放时置顶，交互视频等效果都无法实现；
4、某些机型（如红米，华为部分机型，nexus等）视频强制全屏播放，播放结束后自带广告，必须手动点击手机自带的返回键才能跳回H5，由于跳出了H5，控制视频播放结束的删除事件实际已执行，但必须手动返回到H5才可以看到效果。
iPhone上基本不存在以上问题，体验相对完美。
独门秘籍
iH5目前有一个方法可隐藏Android手机视频进度条，但不一定所有Android手机都适用，尤其是强制全屏播放的手机。测试了小米4，华为V8，TCL，均看不到进度条。
方法：视频高度必须大于1040，舞台／设备属性的裁剪选Yes。
原因：舞台裁剪属性是在H5展示中，舞台长度超过Android手机显示屏幕时，会把底下的部分切掉。
注意：iH5编辑器上的“视频属性”→“画布”必须选No，且别忘记选自动播放或者添加事件触发视频播放。以前视频属性画布选Yes才满意控制条，但微信版本更新，若视频属性的画布选Yes，视频预览效果是白屏的。
官方问答
视频的限制，主要是微信内置X5浏览器在搞事，以下是来自腾讯浏览服务官网的解答，可能对大家有点帮助。
问：视频上方的播放按钮和播放进度条如何去掉?
答：在tbs里qq域名下的不会显示我们的面板，其它域名下，现在需要我们这边产品配置一下名单，在tbs2.1已经开始逐步放开（部份测试过的站点已经不在强制显示我们的面板）
问：Android 微信内，是否有办法在视频层之上放置素材元素？比如：在视频播放过程中，有一个网页元素在视频上漂浮。
答：在微信或手Q上，如果是qq.com域名下的video可以通过不指定control属性（表明由页面自己绘制控制面板）来控制，如果指定了control属性我们就会用我们的播放器完全覆盖页面上相应区域作何元素，如果不指定control属性的，内核就只绘制视频内容，需要由页面自己实现播放控制逻辑
问：为何在微信内置x5浏览器中，视频不能自动播放？
答：设计如此，禁止自动播放，防止在数据网络下自动播放，浪费流量
机智的我猜到你会问我，为什么iPhone可以自动播放！下面有答案，但我看不懂，所以别问我！
iPhone自动播放视频，可以通过以下代码解决，但必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效，可能是微信接口对此做了某些限制。
（该代码源自互联网，仅供参考）
<audio preload="preload" controls id="car_audio" src="http://media.xitaoinfo.com/ei_zamenjiehunba.mp3
" loop></audio>
<video id="video" controls="" preload="none" mediagroup="myVideoGroup" poster="http://media.w3.org/2010/05/sintel/poster.png">
<source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4
" type="video/mp4">
<source id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm">
<source id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg">
<p>Your user agent does not support the HTML5 Video element.</p>
</video>
<!-- 必须加在微信api资源 -->
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
//一般情况下，这样就可以自动播放了，但是一些奇葩iPhone机不可以
document.getElementById('car_audio').play();
//必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
document.addEventListener("WeixinJSBridgeReady", function () {
document.getElementById('car_audio').play();
document.getElementById('video').play();
}, false);
</script>
音频篇
用户体验对比
Android手机基本上是无法同时播放多个音频。若有多个音频，比如有背景音乐和其他音效，其他音频播放时，背景音乐会自动暂停。因此记得增加事件控制背景音乐继续播放。
iPhone微信最新版本（6.5.5）只能自动播放或者通过轻触事件直接或者间接触发音频播放。原因是微信限制了音乐播放方式，音乐页面下的事件，比如说页面显示，触发音频播放是无效的。间接的意思是可以通过轻触控制某个对象播放／出现，再控制音频播放，但是多于1层关系，就无效了。
官方问答
超多人问Android为什么不能同时播放2个，以下来自腾讯浏览服务官网问答可以给你答案！
问：播放音效时，为啥会把我后台的BGM播放给暂停掉？
答：播放音效需要获取声音输出焦点，目前只支持同时播放一个音效。（播放声音时当前音频需要获取 audiofocus ，系统在audiofocus丢失时会通知其它音频播放软件，这个暂停应该是播放软件自身的行为，我们本身并没有暂停后台音频，只是向系统申请了 audiofocus。）
序列帧
Android手机基本没太大问题，除了加载问题和体积太大有可能会跳帧。
iPhone 6以上，对资源比较敏感，一次性加载资源太大，容易造成闪退，这是所有H5都面临的问题。iH5上zip文件太大，可能会导致闪退或者load两次的情况。
解决方法：用iH5工具操作时，在画布下加幻灯片，上传zip文件。画布属性选canvas模式，幻灯片属性设置预加载比例（10%－70%，根据实际情况调整）。
